<template>
  <div>
    <el-table
        :data="tableData"
        border
        style="width: 100%">
      <el-table-column
          fixed
          prop="id"
          label="Userid"
          width="80">
      </el-table-column>

      <el-table-column
          prop="email"
          label="Email"
          width="180">
      </el-table-column>
      <el-table-column
          prop="firstName"
          label="Firstname"
          width="95">
      </el-table-column>
      <el-table-column
          prop="lastName"
          label="Lastname"
          width="90">
      </el-table-column>
      <el-table-column
          prop="status"
          label="Status"
          width="68">
      </el-table-column>
      <el-table-column
          prop="address1"
          label="Address1"
          width="130">
      </el-table-column>


      <el-table-column
          prop="city"
          label="City"
          width="100">
      </el-table-column>
      <el-table-column
          prop="state"
          label="State"
          width="60">
      </el-table-column>
      <el-table-column
        prop="zip"
        label="Zip"
        width="80">
    </el-table-column>
      <el-table-column
        prop="country"
        label="Country"
        width="80">
    </el-table-column>
      <el-table-column
        prop="phone"
        label="Phone"
        width="120">
    </el-table-column>
      <el-table-column
          prop="favouriteCategoryId"
          label="FavouriteCategoryId"
          width="180">
      </el-table-column>
      <el-table-column
          prop="languagePreference"
          label="LanguagePreference"
          width="180">
      </el-table-column>
      <el-table-column
          prop="listOption"
          label="ListOption"
          width="120">
      </el-table-column>
      <el-table-column
          prop="bannerOption"
          label="BannerOption"
          width="120">
      </el-table-column>



      <el-table-column
          fixed="right"
          label="操作"
          width="90">
        <template slot-scope="scope">
          <el-button @click="edit(scope.row)" type="text" size="small">查看或修改</el-button>

        </template>
      </el-table-column>


    </el-table>
    <!--实现分页查询-->
    <el-pagination
        background
        layout="prev, pager, next"
        page-size="6"
        :total=counts
        @current-change="page">
    </el-pagination>
  </div>

</template>

<script>
export default {
  methods: {
    //分页
    page(currentPage) {

      const _this = this
      axios({
        method: "GET",
        url:' http://115.29.176.82:8081/manager/api/account?' +
            'publicKey=MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCnUJbsLJZp' +
            'lJsyzK4RXfCY5bal%0Asdy1ou7JNIkJpk%2ByldAANl4Km6cDVggIHho7OfBV3pv' +
            'DgopAD2bpJ%2FhaMcPAvbdx%0AYF2eqibJy9fm5gAJ8ImeEO4sTygNnxAXUYYZk3xzJaAP' +
            'Iv2vBPEg2jK7Ge7ICac3%0ADKjDJUisqF4LsD5CGQIDAQAB',
        params: {
          size: 6,
          page: currentPage
        }
      }).then(function (resp) {
        _this.tableData = (resp.data.data.list)
      })
    },

    edit(row) {
      this.$router.push({
        path:'/accountupdate',
        query:{
          id:row.id,
          password:row.password,
          email:row.email,
          firstName:row.firstName,
          lastName:row.lastName,
          status:row.status,
          address1:row.address1,
          // address2:row.address2,
          city:row.city,
          state:row.state,
          zip:row.zip,
          country:row.country,
          phone:row.phone,
          favouriteCategoryId:row.favouriteCategoryId,
          languagePreference:row.languagePreference,
          listOption:row.listOption,
          bannerOption:row.bannerOption,

        }
      })

    },


  },

  data() {
    return {
      counts:null,
      tableData: [
        {
          id:12,
          password:"aaaaaaa",
          email:'55554444@qq.com',
          firstName:'cheng',
          lastName:'jie',
          state:'p',
          zip:'wwww',
          country:'wwww',
          phone:'wwww',
          favouriteCategoryId:'wwww',
          languagePreference:'wwww',
          listOption:'wwww',
          bannerOption:'wwww',
          status:'wwww',
          address1:'wwww',
          city:'wwww',


        }
      ]
    }
  },
  created() {
    const _this=this

    axios({
      method:"GET",
      url:' http://115.29.176.82:8081/manager/api/account?' +
          'publicKey=MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCnUJbsLJZp' +
          'lJsyzK4RXfCY5bal%0Asdy1ou7JNIkJpk%2ByldAANl4Km6cDVggIHho7OfBV3pv' +
          'DgopAD2bpJ%2FhaMcPAvbdx%0AYF2eqibJy9fm5gAJ8ImeEO4sTygNnxAXUYYZk3xzJaAP' +
          'Iv2vBPEg2jK7Ge7ICac3%0ADKjDJUisqF4LsD5CGQIDAQAB',
      params:{
        size:6,
        page:1
      }
    }).then(function (resp){
      _this.counts=resp.data.data.counts
      _this.tableData = (resp.data.data.list)

    })
  }
}


</script>